<script setup lang="ts">
import { reactive, watch } from 'vue'

import $config from '@/utils/config'

const props = defineProps({
  modelValue: {
    type: Number,
    default: () => 1
  }
})

const emit = defineEmits(['update:modelValue'])

const state = reactive({
  list: $config.phaseList,
  inputValue: props.modelValue ? props.modelValue : ''
})

const change = () => {
  emit('update:modelValue', state.inputValue)
}

watch(
  () => props.modelValue,
  (val: any) => {
    state.inputValue = val
  }
)
</script>

<template>
  <el-select-v2
    v-model="state.inputValue"
    filterable
    :options="state.list"
    placeholder="请选择方向"
    value-key="value"
    @change="change"
  />
</template>

<style lang="scss" scoped></style>
